<style type="text/css">
	.clicked{
		cursor: pointer;
	}
	.expand{

		float: left;
		min-height: 32px;
		WIDTH: 15PX;
		TEXT-ALIGN: CENTER;
		clear: left;
	}
	.checkbox label{
		padding-left: 5px;
	}
</style>
<in name="permisson" value="7">
	<div class="filter-controls"><h4>管理所属区域:{$organization}</h4></div>
	<div id="tree">
		<ul class="list-unstyled">
			<volist name="area" id="vo">
				<eq name="vo['checked']" value="1">
					<li class="clicked j_province">

						<empty name="vo['_child']">
							<div class="expand">- </div>
							<else/>
							<div class="expand">+</div>
						</empty>

						<eq name="vo['checked']" value="1">
							<div class="checkbox">
								<label>
									{$vo.province}
								</label>
							</div>
						</eq>
						<eq name="key" value="0">
							<ul class="list-unstyled clearfix j_city">
								<else/>
								<ul class="hide list-unstyled clearfix j_city">
						</eq>
						<volist name="vo['_child']" id="child">
							<eq name="child['checked']" value="1">
					<li style="margin-left: 25px;" class="pull-left">
						<div class="checkbox">
							<label>
								{$child.city}
							</label>
						</div>
					</li>
				</eq>
			</volist>
		</ul>
		</li>
		</eq>
		</volist>
		</ul>
	</div>
</in>
<script type="text/javascript">
	$(function() {
		$(".clicked").each(function (index, item) {
			console.log("each click",item);
			$(item).click(function (ev) {
				console.log(ev.target);
				var ele = $(ev.target).parent();
				ele.find("ul").toggleClass("hide");
				if (ele.find("ul").hasClass("hide")) {
					$(ele.find(".expand")).text("+");
				} else {
					$(ele.find(".expand")).text("-");
				}
			});
		});

		$(".j_province input").change(function(ev){
			var $cur = $(ev.target).parents(".j_province");

			console.log($(ev.target).hasClass("j_province_value"));

			if(!$(ev.target).hasClass("j_province_value")){
				return;
			}
			var $target = $(ev.target);

			console.log($target,$target.prop("checked"));
			$cur.find(".j_city input").each(function(index,item){

				if(true == $target.prop("checked") ) {
					$(item).prop("checked",true);
				}else{
					$(item).prop("checked",false);
				}
			})
		})


	}); //end ready
</script>

<!--{__NORUNTIME__}-->